<script setup>
import FirstTitle from "@comp/FirstTitle";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import { onMounted } from "vue";
import { searchDataPzzh } from "@/api/search";
import { addOrUpdatePzzh } from "@/api/addOrUpdate";

const city = window.globalObj.name;
const editorRef = shallowRef();

const toolbarConfig = {};
const editorConfig = {
  placeholder: "请输入内容...",
};
const mode = ref("default");

// 加载html
const initHtml = () => {
  searchDataPzzh({ m: "组织指挥-协同组织" }).then((res) => {
    const { data } = res;
    valueHtml.value = data.find((x) => x.k === "协同组织")?.v || "";
  });
};

const handleCreated = (editor) => {
  editorRef.value = editor; // 记录 editor 实例，重要！
};

const valueHtml = ref(
  "基本原则：①严格执行战时指挥体制，遵循集中领导、统一指挥、分工负责、分级组织的协同组织原则；②严格落实指挥责权，通常按逐级指挥权限协同组织行动，特殊情况可越级指挥协同，但应及时通报有关情况；③严格请示、报告制度，通常情况下应遵循基本工作流程，先请示后行动，行动后及时报告，特殊情况可边请示边行动；④严格执行牵头单位负总责，组成配合单位按分工负责的行动规则，确保政令畅通；⑤严格执行军地协同组织规则和程序，确保战时军地协同组织有序；⑥密切协作、主动协同配合，最大限度地形成合力，发挥整体效益。<br/>基本方法：①采取计划协同和随机协同相结合的方式组织指挥所开设、临战筹划、人防工程转换、报知手段优化、信息系统防护、专业队伍扩编、综合保障准备、战备动员的协同组织，通常按计划协同为主，出现意外情况时，快速随机协同；②采取多种手段，充分发挥信息系统功能，广泛利用文电传输、信息共享、视频通联等多种方式，开展线上线下协同组织，切实提高协同组织的实效性；③采取各级人防指挥机构属地内全权指挥为主，必要时，上级派出前方指挥组深入一线现地督导组织协同，切实增强协同组织的针对性、实效性和连续性。"
);

const saveProgramme = () => {
  ElMessageBox.confirm(`确定要保存吗?`, "警告", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
    customClass: "message-box",
  }).then(() => {
    addOrUpdatePzzh({
      m: "组织指挥-协同组织",
      data: [
        {
          k: "协同组织",
          v: valueHtml.value,
        },
      ],
    })
      .then(() => {
        ElMessage.success("操作成功");
      })
      .catch(() => {});
  });
};

onMounted(() => {
  initHtml();
});
onBeforeUnmount(() => {
  const editor = editorRef.value;
  if (!editor) return;
  editor.destroy();
});
</script>
<template>
  <div class="">
    <FirstTitle name="协同组织" />
    <div style="border: 1px solid #ccc" class="top-15">
      <Toolbar
        style="border-bottom: 1px solid #ccc"
        :editor="editorRef"
        :defaultConfig="toolbarConfig"
        :mode="mode"
      />
      <Editor
        style="height: 500px; overflow-y: hidden"
        v-model="valueHtml"
        :defaultConfig="editorConfig"
        :mode="mode"
        @onCreated="handleCreated"
      />
    </div>

    <div class="flex-justify-end top-20">
      <el-button type="primary" class="save-btn" @click="saveProgramme"
        >保存</el-button
      >
    </div>
  </div>
</template>
<style scoped lang="scss"></style>